<template>
	<!--http://www.cnblogs.com/wuxiaobin/articles/6618768.html-->
	<div style="height: 100%;">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-icon mui-icon-left-nav" @click="goBack"></a>
			<h1 class="mui-title">校历</h1>
		</header>
		<div class="mui-content" id="content" style="height: 100%;">
			<div id="cal">
				<div id="top">
					<div class="step">
						<span id="prev"></span>
					</div>
					<div class="select">
						<select id="year-select"></select>&nbsp;年
						<select id="month-select"></select>&nbsp;月
					</div>
					<div class="step stepRight">
						<span id="next"></span>
					</div>
					<a href="javascript:;;" id="now-date">回到今天</a>
				</div>
				<ul id="wk">
					<li>一</li>
					<li>二</li>
					<li>三</li>
					<li>四</li>
					<li>五</li>
					<li><b>六</b></li>
					<li><b>日</b></li>
				</ul>
				<div id="cm"></div>
				<div id="bm">
					<div class="heavenly-branch">
						<span style="display: none;" id="heavenly"></span>
						<span style="display: none;" id="branch"></span>
						<span id="aa"></span>
					</div>
					<span class="localWeek">{{localWeek}}</span>
					<!--					<a href="javascript:;;" id="now-date">回到今天</a>-->
				</div>
			</div>
			<ul class="mui-table-view mui-table-view-striped mui-table-view-condensed calendarList">
				<li class="mui-table-view-cell" v-for="calendar in calendarList">
					<div class="mui-table">
						<div class="mui-table-cell mui-col-xs-10">
							<h5 class="mui-ellipsis">{{calendar.Title}}</h5>
							<p class="mui-h6 mui-ellipsis">{{calendar.Time}}</p>
						</div>
						<div class="mui-table-cell mui-col-xs-2 mui-text-right">
							<span class="mui-h5">{{calendar.Countdown}}</span>
						</div>
					</div>
				</li>
			</ul>
		</div>
	</div>
</template>

<script>
	import {
		getCalendarList
	} from '@/service/getData';
	export default {
		data() {
				return {
					calendarList: [],
					localWeek:'',
					today: new Date().Format('yyyy-MM-dd')
				}
			},
			created() {
				let _this = this;
				_this.schoolId = _this.$route.params.schoolId;
				getCalendarList({ //获取数据
					"schoolId": _this.schoolId,
					"Date": _this.today
				}).then((res) => {
//					debugger
					if(res.code == 1) {
//						let localW = 
						_this.localWeek = res.data.Week == 0 ? '' : ('第'+res.data.Week+'周');
						_this.calendarList = res.data.Events;
					}
				})
			},
			mounted() {
				let self = this;
				calendar.init({
					cellClickCallback: function(cell, datedata) {
						self.today = datedata.solarYear + '-' + datedata.solarMonth + '-' + datedata.solarDate;
//						console.log(self.today);
						getCalendarList({ //获取数据
								"schoolId": self.schoolId,
								"Date": self.today
							}).then((res) => {
//								debugger
								if(res.code == 1) {
									self.localWeek = res.data.Week == 0 ? '' : ('第'+res.data.Week+'周');
									self.calendarList = res.data.Events;
								}
							})
					}
				});
			}
	}
</script>

<style scoped>
	#prev{
		/*width: 25px;
		height: 25px;
		display: block;
		background: url(../../../static/img/left.png) no-repeat center;*/
		/*background-size: 80%;*/
	}
</style>